<html>
   <head>
   <script type="text/javascript">
      function makeEditable()
      {
          document.getElementsByClassName('textarea')[0].contentEditable = true;
      }

      function text()
      {
          return document.getElementsByClassName('textarea')[0].innerHTML;
      }

      function findWordPosition(text,word)
      {
          var divElement = document.getElementsByClassName('textarea')[0];
          divElement.innerHTML = text;
          var regex = new RegExp(word,'g');
          divElement.innerHTML  = divElement.innerHTML.replace(regex, '<span id="word">' + word + '</span>');
          var spanElement = document.getElementById('word');
          var rect = spanElement.getBoundingClientRect();
          var array = new Array();
          array.push(rect.left);
          array.push(rect.top);
          array.push(rect.right - rect.left);
          array.push(rect.bottom - rect.top);
          divElement.innerHTML = "";
          return array;
      }
   </script>
   </head>
   <body>
      <div class="textarea" style="width:300px; height:200px; border: 1px solid #ccc"></div>
   </body>
</html>

